/**
 * 该文件用于创建路由器，配置路由的规则
 */

// 引入 createRouter 与 createWebHistory
import {
  createRouter,
  createWebHistory,
  createWebHashHistory,
} from "vue-router";

// 引入 组件
import Home from "../views/Home.vue";
import About from "../views/About.vue";
import Detail from "../views/Detail.vue";
import Film from "../views/Film.vue";

// 调用 createRouter 创建路由器 (router - 路由器实例对象)
const router = createRouter({
  // history 配置项，用于声明使用那种路由模式
  //      createWebHistory      -     history 模式
  //      createWebHashHistory  -     hash 模式
  history: createWebHashHistory(),

  // routes 配置项：用于配置规则规则
  routes: [
    {
      path: "/home", // URL pathname 部分的地址
      name: "home", // 命令路由，给当前路由取一个名字，后续可以通过该名字直接跳转
      component: Home, // component 表示当前路由对应的组件
    },
    {
      path: "/about",
      name: "about",
      component: About,
    },
    {
      path: "/info",
      name: "info",
      component: Detail,
    },
    {
      // 动态路径传参
      //    /film/abc
      //    /film/123
      path: "/film/:id",
      name: "film",
      component: Film,
    },
  ],
});

// 需要将 路由器实例对象（router）与应用实例对象（app） 关联起来。使用 app.use(router) 所以需要默认导出 router

export default router;
